<template>
  <div class="route_container"></div>
</template>
<script setup>
import { ref,computed, watch } from "vue";
import { useRoute } from "vue-router";
const route = useRoute();
// params传参
// const id = computed(() => route.params.id)
// console.log('id', id.value)
// query传参
const id = computed(() => route.query.id)
console.log('id', id.value)
// 实时监听路由上的参数变化
const id_bak = ref(null);
watch(
  () => route.query,
  (newVal, oldVal) => {
    if (newVal.id != oldVal?.id) {
      id_bak.value = newVal.id;
    }
    console.log("id_bak.value", id_bak.value);
  },
  {
    immediate: true,
    deep: true,
  }
);
</script>
